<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
<title>微信</title>
<link rel="stylesheet" href="../../src/mobilebone.css">
<link rel="stylesheet" href="css/wechat.css">
</head>

<body>
<div class="header out" data-role="header">
	<h1>微信</h1>
    <a href="../index.html" class="icon-add" data-ajax="false">添加</a>
    <a href="../index.html" class="icon-search" data-ajax="false">搜索</a>
</div>
<div id="pageHome" class="page out" data-title="微信">
    <div class="content">
    	<div class="">
        	<a href="#pageChatList" class="wechat-list">
            	<img src="img/head/header-1.jpg">
                <div class="cell">
                	<div class="wechat-h-time"><h5>爱钓鱼的小伙</h5><time>早上09:51</time></div>
                    <p>点击右上角搜索图标可以回到主测试页面</p>
                </div>
            </a>
        	<a href="#pageChatList" class="wechat-list">
            	<img src="img/head/public-1.png">
                <div class="cell">
                	<div class="wechat-h-time"><h5 class="business">微团购</h5><time>早上09:38</time></div>
                    <p>食间道，兄弟姐妹们来报道喽</p>
                </div>
            </a>
            <a href="#pageChatList" class="wechat-list">
            	<img src="img/head/public-2.png">
                <div class="cell">
                	<div class="wechat-h-time"><h5>腾讯新闻</h5><time>早上08:47</time></div>
                    <p>习近平：文艺不能当市场的奴隶</p>
                </div>
            </a>
            <a href="#pageChatList" class="wechat-list">
            	<img src="img/head/public-3.png">
                <div class="cell">
                	<div class="wechat-h-time"><h5>订阅号</h5><time>早上08:36</time></div>
                    <p>腾讯大申网:图说上海·女儿啊，快醒醒</p>
                </div>
            </a>
            <a href="#pageChatList" class="wechat-list">
            	<img src="img/head/header-2.jpg">
                <div class="cell">
                	<div class="wechat-h-time"><h5>上海设计中心</h5><time>昨天</time></div>
                    <p>橘：我觉得有很多角落可以Ps上</p>
                </div>
            </a>
            <a href="#pageChatList" class="wechat-list">
            	<img src="img/head/header-3.jpg">
                <div class="cell">
                	<div class="wechat-h-time"><h5>紫禁之巅敲代码</h5><time>昨天</time></div>
                    <p>西门吹雪:[视频]</p>
                </div>
            </a>
            <a href="#pageChatList" class="wechat-list">
            	<img src="img/head/public-4.png">
                <div class="cell">
                	<div class="wechat-h-time"><h5 class="business">手机话费充值</h5><time>昨天</time></div>
                    <p>【疯抢流量】全国联通冲200M送50M</p>
                </div>
            </a>
            <a href="#pageChatList" class="wechat-list">
            	<img src="img/head/header-4.jpg">
                <div class="cell">
                	<div class="wechat-h-time"><h5>mobilebone作者</h5><time>星期三</time></div>
                    <p><img src="img/ok.png" width="16" height="16"></p>
                </div>
            </a>
            <a href="#pageChatList" class="wechat-list">
            	<img src="img/head/header-5.jpg">
                <div class="cell">
                	<div class="wechat-h-time"><h5>tracy</h5><time>星期三</time></div>
                    <p>Ah he'll make a good companion I hope.</p>
                </div>
            </a>
        </div>
    </div>
</div>
<div id="pageChatList" class="page out">
	<div class="header" data-role="header">
    	<a href="#pageHome" class="icon-back" data-rel="back">返回</a>
        <h1>腾讯新闻</h1>
    </div>
	<div class="content">
    	<div class="wechat-detail">
    		<img id="screenShot" data-src="img/screenshot/1.jpg" data-width="720" data-height="2405">          
    	</div>
        <div class="loading"></div>
   	</div>
</div>
<div id="pageContacts" class="page out">
	<div class="content">
    	<div>
        	<div class="contact-group">
                <div class="contact-list">
                    <img src="img/head/contact-1.png">
                    <nickname>新的朋友</nickname>
                </div>
                <div class="contact-list">
                    <img src="img/head/contact-2.png">
                    <nickname>群聊</nickname>
                </div>
                <div class="contact-list">
                    <img src="img/head/contact-3.png">
                    <nickname>标签</nickname>
                </div>
                <div class="contact-list">
                    <img src="img/head/contact-4.png">
                    <nickname>公众号</nickname>
                </div>
            </div>
            <h5 class="contact-h">企业号</h5>
            <div class="contact-group">
                <div class="contact-list">
                    <img src="img/head/contact-5.png">
                    <nickname>腾讯企业号</nickname>
                </div>
            </div>
            <h5 class="contact-h">A</h5>
            <div class="contact-group">
                <div class="contact-list">
                    <img src="img/head/header-1.jpg">
                    <nickname>爱钓鱼的小伙</nickname>
                </div>
                <div class="contact-list">
                    <img src="img/head/header-7.jpg">
                    <nickname>阿里巴巴</nickname>
                </div>
            </div>
            <h5 class="contact-h">B</h5>
            <div class="contact-group">
                <div class="contact-list">
                    <img src="img/head/header-8.gif">
                    <nickname>Big-laugh</nickname>
                </div>
            </div>
            <h5 class="contact-h">M</h5>
            <div class="contact-group">
                <div class="contact-list">
                    <img src="img/head/header-0.jpg">
                    <nickname>Mobilebone</nickname>
                </div>
            </div>
            <h5 class="contact-h">Q</h5>
            <div class="contact-group">
                <div class="contact-list">
                    <img src="img/head/header-6.jpg">
                    <nickname>乔巴</nickname>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="pageFind" class="page out">
	<div class="content">
    	<div>
        	<div class="find-group">
            	<div class="find-list">
                	<i class="icon-find icon-find-1"></i>朋友圈
                </div>
            </div>
            <div class="find-group">
            	<div class="find-list">
                	<i class="icon-find icon-find-2"></i>扫一扫
                </div>
                <div class="find-list">
                	<i class="icon-find icon-find-3"></i>摇一摇
                </div>
            </div>
            <div class="find-group">
            	<div class="find-list">
                	<i class="icon-find icon-find-4"></i>附近的人
                </div>
                <div class="find-list">
                	<i class="icon-find icon-find-5"></i>漂流瓶
                </div>
            </div>
            <div class="find-group">
            	<div class="find-list">
                	<i class="icon-find icon-find-6"></i>购物
                </div>
                <div class="find-list">
                	<i class="icon-find icon-find-7"></i>游戏
                </div>
            </div>
        </div>
    </div>
</div>
<div id="pageMe" class="page out">
	<div class="content">
    	<div>
        	<div class="me-group">
            	<div class="me-header">
                	<img class="me-head" src="img/head/header-0.jpg">
                    <div class="me-detail">
                    	<h6>Mobilebone</h6>
                        <img src="img/account.png" width="153" height="16">
                    </div>
                </div>
            </div>
            <div class="me-group">
            	<div class="me-list">
                	<i class="icon-me icon-me-1"></i>相册
                </div>
                <div class="me-list">
                	<i class="icon-me icon-me-2"></i>收藏
                </div>
            </div>
            <div class="me-group">
            	<div class="me-list">
                	<i class="icon-me icon-me-3"></i>钱包
                </div>
            </div>
            <div class="me-group">
            	<div class="me-list">
                	<i class="icon-me icon-me-4"></i>设置
                </div>
            </div>
        </div>
    </div>
</div>

<div class="footer out" data-role="footer">
	<a href="#pageHome" data-rel="auto">
    	<i class="icon-wechat"></i>微信
    </a>
    <a href="#pageContacts" data-rel="auto">
    	<i class="icon-contacts"></i>通讯录
    </a>
    <a href="#pageFind" data-rel="auto">
    	<i class="icon-finds"></i>发现
    </a>
    <a href="#pageMe" data-rel="auto">
    	<i class="icon-mes"></i>我
    </a>
</div>

<script src="js/iscroll-lite.js"></script>

<script src="js/zepto-docs.js"></script>
<!--zepto或者fastclick都是可以的
-->
<!--<script src="js/fastclick.js"></script>
<script>
FastClick.attach(document.body);
</script>-->
<script src="../../src/mobilebone.js"></script>
<script src="js/wechat.js"></script>
</body>
</html>
